<template>
  <div class="verifyDataList">
    <div style="flex: 1">
      <el-card shadow="never">
        <div slot="header" style="display: flex;align-items: center;justify-content: space-between">
          <n-title title="核查任务列表"/>
          <div>
            <el-button size="small" plain type="primary" @click="toJudgeTaskIndex">返回列表</el-button>
          </div>
        </div>
        <div class="ha-top">

        </div>
        <data-table
            :api="selectJudgeTaskList"
            ref="dataTable"
            :options="options"
            :columns="columns"
            :query="selectFormModel"
        ></data-table>
      </el-card>
    </div>
  </div>
</template>

<script lang="ts">
import {Component, Ref, Vue} from 'vue-property-decorator';
import DataTable from "@/components/DataTable/DataTable.vue";
import NTitle from "@/components/NTitle.vue";
import {selectJudgeTaskList} from '@/api/verifyJudgeMark';
import router from "@/router";

@Component({
  methods: {selectJudgeTaskList},
  components: {NTitle, DataTable}
})
export default class judgeTaskDetail extends Vue {

  @Ref('dataTable') private dataTable: any;
  subAreaList:any = [];

  selectFormModel: any = {
    workId: router.currentRoute.query.workId,
    verifyTimes: router.currentRoute.query.verifyTimes,
    areaCode: router.currentRoute.query.countyCode
  };
  // table 的参数
  options: any = {
    stripe: true, // 是否为斑马纹 table
    loading: false, // 是否添加表格loading加载动画
    highlightCurrentRow: true, // 是否支持当前行高亮显示
    multipleSelect: false, // 是否支持列表项选中功能
  };
  columns: any = [
    {label: '名称', prop: 'departName'},
    {label: '区县', prop: 'countyName'},
    {label: '类型', prop: 'categoryName'},
    {label: '地址', prop: 'departAddr'},
    {label: '是否已核查', prop: 'judgeState', render: function (createElement, context) {
        if (context.row.judgeState == '1') {
          return createElement('span', ['是']);
        } else {
          return createElement('span', ['否']);
        }
      }
    },
    {label: '是否有标错', prop: 'markState', render: function (createElement, context) {
        if (context.row.markState == '1') {
          return createElement('span', ['是']);
        } else {
          return createElement('span', ['否']);
        }
      }}
  ];


  toJudgeTaskIndex() {
    this.$router.push({path: '/verify/judgeTask'});
  }

  onSearch(): void {
    this.dataTable.refresh();
  }

  mounted() {
    this.onSearch();
  }

}
</script>
<style lang="scss" scoped>
.verifyDataList {
  display: flex;
  gap: 10px;

  .ha-top {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;

    .radio-t {
      display: flex;
      align-items: center;
      gap: 6px;

      span {
        font-size: 14px;
      }
    }
  }
}
</style>
